<template>
  <el-container class="home">
    <el-main>
      <flow-diagram :param="requestSupportParams"></flow-diagram>
      <approval-detail :param="requestSupportParams"></approval-detail>
      <form-main :param="requestSupportParams"></form-main>
      <!--<attachment :param="requestSupportParams"></attachment>-->
    </el-main>
  </el-container>
</template>

<script>
  import FlowDiagram from '@/views/page/workflow/common/flowDiagram.vue'
  import ApprovalDetail from '@/views/page/workflow/common/approvalDetail.vue'
  import FormMain from '@/views/page/workflow/common/formMain.vue'
  // import Attachment from '@/views/page/workflow/common/attachment.vue'

  export default {
    name: 'HisTaskDetail',
    components: {
      FlowDiagram, ApprovalDetail, FormMain
    },
    data() {
      return {
        requestSupportParams: {}, // 保存列表页面传过来的数据
        first: true // 是否第一次进入该页面
      }
    },
    // 第一次创建组件，内部组件使用mounted要在这个之前传参
    beforeMount() {
      this.requestSupportParams = this.$route.query
    },
    // 每次打开页面调用，在mounted之后调用
    beforeRouteEnter(to, from, next) {
      // 这里还无法访问到组件实例，this === undefined
      next(vm => {
        // 通过 `vm` 访问组件实例
        // 是否第一次进入该页面 如果是的，那么不执行该函数
        if (vm.first) {
          vm.first = false
          return
        }
        // 保存列表页面传过来的数据
        vm.requestSupportParams = vm.$route.query
      })
    }
  }
</script>

<style scoped>
  /*让文本可以被选中*/
  .home {
    -moz-user-select: text; /*火狐*/
    -webkit-user-select: text; /*webkit浏览器*/
    -ms-user-select: text; /*IE10*/
    -khtml-user-select: text; /*早期浏览器*/
    user-select: text;
  }
</style>
